<template>
  <view class="page-wraper flex-col">
    <view class="page-wraper-loading" v-if="loading">
      <view class="page-wraper-loadingicon"></view>
      <view class="page-wraper-loadingtext mt-24">loading</view> 
    </view>
    <!-- {{txt}} -->
    <view class="flex-1 hidden bg-gray flex-col page-wraper-content" v-if="token">
      <view  class="page-wraper-body">
        <view v-for="(item, index) in resumeList" :key="index" class="mb-24">
          <job-item :data="item" @ontrue="ontrue" @onEdit="onEdit($event, index)" @onDelete="onDelete(index)"></job-item>
        </view>
        <view>
          <pk-btn :round="true" :isBlank="true" @click="setUpload" :disabled="disabled">
            上传简历
          </pk-btn>
        </view> 
      </view> 
      <view v-if="resumeList.length < 1" class="flex-1 relative">
        <pk-emtry title="未上传简历"></pk-emtry>
      </view>
    </view>
    <view class="flex-1 relative flex-col" v-if="!token">
      <pk-authuser @onLogin="onLogin"></pk-authuser>
    </view> 
  </view>
</template>

<script setup>
  import { ref } from 'vue';
  import { onShow, onShareAppMessage, onShareTimeline, onLoad } from '@dcloudio/uni-app'
  import jobItem from './component/jobitem.vue'
  import { attachmentGetList } from '@/api/api'
  import WXLOG from '@/utils/log'
  import { getTimeYearStr } from '@/utils/utils'
  const resumeList = ref([])
  const token = ref('')
  const disabled = ref(false)
  const txt = ref('')
  const loading = ref(false)

  onShareAppMessage(() => {
    return {
      title: '我的简历',
      path: 'pages/resume/index', 
    }
  })

  onShareTimeline(() => {
    return {
      title: '我的简历',
      path: 'pages/resume/index', 
    }
  })

  const getList = () => {
    loading.value = true
    attachmentGetList().then(res => {
      loading.value = false
      if (res.code != 1000) {
        return
      }
      resumeList.value = res.data.map(item => {
        return {
          ...item,
          tempalias: item.alias,
          created_at: getTimeYearStr(item.created_at, 'time')
        }
      })
    }).catch(err => {
      loading.value = false
    })
  }

  const onDelete = (index) => {
    resumeList.value.splice(index, 1)
  }

  const setUpload = () => { 
    if (resumeList.value.length >= 5 ) {
      uni.showToast({
        title: '简历数量最多5个',
        icon: 'none'
      })
      return
    } 
    wx.chooseMessageFile({
      count: 1, //默认100
      extension:['.pdf'],
      success: function (res) {
        console.log(res);
        uni.showLoading({
          title: '上传中...'
        })
        disabled.value = true
        if (res.tempFiles.length > 0) { 
          uploadFilePromise(res.tempFiles[0].path).then(res => {
            disabled.value = false
            uni.hideLoading()
            if (res.code == 1000) {
              getList()
            } else {
              uni.showToast({
                title: res.msg,
                icon: 'none'
              })
            } 
          }).catch(err => {
            uni.hideLoading()
            disabled.value = false
          })
        }
      }
    });
  }
  

  const uploadFilePromise = (filePath) => {
    return new Promise((resolve, reject) => {
      uni.uploadFile({  
        url: `https://api.bytesbay.cn/bole/attachment/uploadAsync`,  
        filePath: filePath,  
        name: 'filename',  
        header: {  
          Token: uni.getStorageSync('bytesbayToken')
        },  
        success: (res) => {  
          resolve(res.data ? JSON.parse(res.data) : {});  
        },  
        fail: (err) => {
          if (err.is_alert) {

          }
          reject(err);  
        },  
      });  
    })  
  }

  const ontrue = (e) => {
    // resumeList.value = []
    // getList()

    resumeList.value.forEach(item => {
      if (item.attachment_id == e) {
        item.default = true
      } else {
        item.default = false
      }
    }) 
  }
   
  const onEdit = (e, index) => {
    resumeList.value[index].alias = e
    resumeList.value[index].tempalias = e
  }
  const onLogin = () => {
    token.value = uni.getStorageSync('bytesbayToken') || ''
    getList()
  }
  
  onLoad(() => {
    WXLOG.info('info', '-------我的简历-----------', uni.getStorageSync('bytesbayToken'))
    txt.value = 'onShow'
    token.value = uni.getStorageSync('bytesbayToken') || ''
    resumeList.value = []
    if (token.value) {
      getList()
    } 
  })

  onShow(() => {
    token.value = uni.getStorageSync('bytesbayToken') || ''
  })

</script>

<style lang="scss" scoped>
.page-wraper{
  position: relative;
  &-content{
    overflow: hidden;
    overflow-y: auto;
    padding-bottom: 40rpx;
    position: relative;
  }
  &-body{
    padding: 24rpx;
    position: relative;
    // padding-bottom: 100rpx;
    // padding: 24rpx 24rpx 100rpx 24rpx;
  }
  &-footer {
    padding-bottom: 24rpx;
    background: #00b4b3;
  }
  &-footeritem{
    height: 80rpx;
    line-height: 80rpx;
    background: #00b4b3;
    color: #fff;
  }

  &-loadingicon{
    background: url("@/static/loading.png") center center  no-repeat;
    background-size: 56rpx auto;
    width: 56rpx;
    height: 56rpx;
    animation: rotate 1s linear infinite;
  }
  &-loadingtext{
    color: #00b4b3;
  }
  &-loading{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    padding: 10px;
    background: rgba($color: #fff, $alpha: 0.8);
    backdrop-filter: 2px;
    top:0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 999;
  }
}
@keyframes rotate {
    0%{-webkit-transform:rotate(0deg);}
    25%{-webkit-transform:rotate(90deg);}
    50%{-webkit-transform:rotate(180deg);}
    75%{-webkit-transform:rotate(270deg);}
    100%{-webkit-transform:rotate(360deg);}
}
</style>